<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
        <script src="/static/js/common.js"></script>

</head>
<body>
    
<div id="app" v-cloak>   
        <el-table :data="list">
            <el-table-column type="expand" prop="childData">
                <template slot-scope="scope">
                    <el-table :data="scope.row.childData">
                        <el-table-column prop="name" label="名称" sortable align="center">
                            <template slot-scope="scope">
                                <span>{{scope.row.test1}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column prop="num" label="数量" sortable align="center">
                            <template slot-scope="scope">
                                <span>{{scope.row.test12}}</span>
                            </template>
                        </el-table-column>
                    </el-table>
                </template>
            </el-table-column>
            <el-table-column prop="name" label="姓名" sortable align="center">
                <template slot-scope="scope">
                    <span>{{scope.row.Id}}</span>
                </template>
            </el-table-column>
        </el-table>
    </div>
    <script type="text/javascript">
        var app = new Vue({
            el: '#app',
            data: {
                list: [
                    {
                        name: 'houts',
                        childData: [{
                            test1: 'hello',
                            test2: 1,
                        }, {
                            test1: '你好',
                            test2: 1,
                        }]
                    }, {
                        name: 'houts2',
                        childData: [{
                            test1: 'hello',
                            test2: 1,
                        }, {
                            test1: 'hello',
                            test2: 1,
                        }]
                    }
                ]
            }
        });
    </script>
</body>

</html>